{extend name="property@base"/}
{block name='style'}
	<style type='text/css'>
		.formtemplate{
			border-collapse: collapse;
			width:98%;
			margin:5px auto;
			
			
		}
		.formtemplate,.formtemplate tr td,.formtemplate tr th{
			border:1px solid #ccc;
			padding:0 0 0 2px;
		}
		.content{
			overflow-x:scroll;
			overflow-y:auto;
			
		}
	</style>
	
{/block}
{block name='content'}
	<div class='content'>
	<div class="weui-search-bar" id="searchBar" >
	  <form class="weui-search-bar__form" id='searchForm' action="{:url('wage_card/index')}">
	    <div class="weui-search-bar__box">
	      <i class="weui-icon-search"></i>
	      <input type="search" class="weui-search-bar__input" name='date' value="{$date}" id="searchInput" placeholder="请选择日期" required="">
	      <a href="javascript:" class="weui-icon-clear" id="searchClear"></a>
	    </div>
	    <label class="weui-search-bar__label" id="searchText">
	      <i class="weui-icon-search"></i>
	      <span>请选择日期</span>
	    </label>
	  </form>
	  <a href="javascript:" class="weui-search-bar__cancel-btn" id="searchCancel">取消</a>
	</div>
		<table class="formtemplate" id="datatable" border="3" bordercolor="#aaa"  align="center" id="table">
							<tr tr height="30" >
								<th colspan="9"  align="center">
									<div>技工每日绩效工资明细单</div>
								</th>
							</tr>
							<tr tr height="30">
								<td colspan="9"  align="right">姓名：{$user.name}&nbsp;&nbsp;&nbsp;日期：{$date}&nbsp;&nbsp;</td>
							</tr>
							<tr height="30" >
								<td width="50" class="p-l" >序号</td>
								<td width="300" class="p-l">派工内容</td>
								<td width="150" class="p-l">工作时段</td>
								<td width="100" class="p-l">工作用时</td>
								<td width="100" class="p-l">工作效率系数</td>
								<td width="100" class="p-l">难度系数</td>
								<td width="100" class="p-l">环境系数</td>
								<td width="100" class="p-l">标准小时工资</td>
								<td width="100" class="p-l">金额</td>
							</tr>
							{volist name='workwages' id='workwage'}
								<tr class='font-normal' tr height="30">
									<td class="p-l">{$key+1}</td>
									<td class="p-l">{$workwage.content} {$workwage.remark}</td>
									<td class="p-l">{$workwage.starttime}-{$workwage.endtime}</td>
									<td class="p-l">{$workwage.worktime|round=###,2}</td>
									<td class="p-l">{$workwage.efficiency|round=###,2}</td>
									<td class="p-l">{$workwage.coefficient|round=###,2}</td>
									<td class="p-l">{$workwage.environmental|round=###,2}</td>
									<td class="p-l">{$workwage.hourlywage|round=###,2}</td>
									<td class="p-l">{$workwage.wage|round=###,2}</td>
								</tr>
							{/volist}
								
							<tr tr height="30">
								<th class="p-l" colspan="2" >合计</th>
								<th class="p-l" ></th>
								<th class="p-l">{$wage.worktime|round=###,2}</th>
								<th class="p-l"></th>
								<th class="p-l"></th>
								<th class="p-l"></th>
								<th class="p-l"></th>
								<th class="p-l">{$wage.workwage|round=###,2}</th>
							</tr>
							<tr tr height="30">
								<td class="p-l">序号</th>
								<td class="p-l" align='center'>待工时段</th>
								<td class="p-l">待工时长</th>
								<td colspan="3" align='center' class="p-l">待工原因</th>
								<td class="p-l">待工系数</th>
								<td class="p-l">标准小时工资</th>
								<td class="p-l">金额</th>
							</tr>
							{volist name='restwages' id='restwage'}
							<tr class='font-normal' tr height="30">
								<td class="p-l">{$key+1}</td>
								<td class="p-l" align='center'>{$restwage.starttime}-{$restwage.endtime}</td>
								<td class="p-l">{$restwage.resttime|round=###,2}</td>
								<td colspan="3" align='center' class="p-l">{$restwage.remark}</td>
								<td class="p-l">{$restwage.efficiency|round=###,2}</td>
								<td class="p-l">{$restwage.hourlywage|round=###,2}</td>
								<td class="p-l">{$restwage.wage|round=###,2}</td>
							</tr>
							{/volist}
							<tr tr height="30">
								<th class="p-l" colspan="2" >合计</th>
								<th class="p-l">{$wage.resttime|round=###,2}</th>
								<th class="p-l" colspan='3'></th>
								<th class="p-l"></th>
								<th class="p-l"></th>
								<th class="p-l">{$wage.restwage|round=###,2}</th>
							</tr>
						</table>
	</div>
{/block}
{block name='script'}
	<script type='text/javascript'>
	$(function(){
		$("#searchInput").calendar();
		$("#searchInput").change(function(){
			if($(this).val()!="{$date}"&&$(this).val()!=""){
				$("#searchForm").submit();
			}
		});
		
		
		var width = document.documentElement.clientWidth;
		  var height =  document.documentElement.clientHeight;
		  if( width < height ){
		      console.log(width + " " + height);
		      $print =  $('.content');
		      $print.width(height);
		      $print.height(width);
		      $print.css('top',  (height-width)/2 );
		      $print.css('left',  0-(height-width)/2 );
		      $print.css('transform' , 'rotate(90deg)');
		      
		      $print.css('transform-origin' , width/2+"px  "+width/2+"px");
		 }

	});
		
	</script>
{/block}